<!doctype html>
<html lang="en">
<head>
	<title>Numpad Game</title>

	<link href="https://fonts.googleapis.com/css?family=Share+Tech+Mono" rel="stylesheet">
	<link rel="stylesheet" href="index.css">
</head>

<body onload="onLoad()">
	<div class="container">
		<ul class="score">
			<li class="title">HIGH SCORES</li>
			<li id="highScore1Display">0</li>
			<li id="highScore2Display">0</li>
			<li id="highScore3Display">0</li>
			<li id="highScore4Display">0</li>
			<li id="highScore5Display">0</li>
		</ul>

		<div class="game">
			<table style="width:100%">
				<tr>
					<td class="powerText">Power</td>
					<td> </td>
					<td class="scoreText">Score</td>
				</tr>
				<tr>
					<td class="powerNumber">0</td>
					<td> </td>
					<td class="scoreNumber">0</td>
				</tr>
			</table>
			<p class="subtext"></p>
			<p class="counter">5->8 TO BEGIN</p>
			<div class="timer"></div>

			<div class="numpad">
				<div class="column">
					<span class="row">7</span>
					<span class="row">8</span>
					<span class="row">9</span>
				</div>

				<div class="column">
					<span class="row">4</span>
					<span class="row">5</span>
					<span class="row">6</span>
				</div>

				<div class="column">
					<span class="row">1</span>
					<span class="row">2</span>
					<span class="row">3</span>
				</div>
			</div>
		</div>

		<div class="upgrades">
		</div>

	</div>

	<canvas class="canvas"></canvas>

	<script src="index.js"></script>
	<script src="explosion.js"></script>
</body>
</html>